<template>
    <!-- components/goods/index.wxml -->
    <!-- 列表 -->
    <view class="list">
        <view class="all-goods">
            <view class="all-icon">
                <image :src="navItem.icon"></image>
            </view>
            <view class="all-text">{{ navItem.name }}</view>
            <view class="all-more" @tap="onGoType">
                <view class="all-more-text">更多</view>
                <view class="all-more-icon">
                    <image :src="imgUrl + '/imgs/icon/more.png'"></image>
                </view>
            </view>
        </view>
        <view class="list-info">
            <scroll-view class="scroll-h" :scroll-x="true">
                <view class="list-info-item" @tap="goodsDetail($event, { id: item.id })" :data-id="item.id" v-for="(item, index) in navItem.goodsList" :key="index">
                    <view class="list-info-img">
                        <image :src="item.goods_img + '?x-oss-process=image/resize,w_320'" mode="aspectFill" :data-index="index"></image>
                    </view>

                    <view class="list-info-detail">
                        <view class="list-info-detail-title">
                            {{ item.goods_title }}
                        </view>
                        <view class="detail-tip" v-if="item.goods_tag.length > 0">
                            <view class="tip-span" v-for="(item, index1) in item.goods_tag" :key="index1">{{ item }}</view>
                            <view class="clear"></view>
                        </view>
                        <view>
                            <view class="list-info-detail-price">
                                <view class="list-info-detail-price-discounts">
                                    <span>¥</span>
                                    {{ item.goods_min_price }}
                                    <span>/{{ item.goods_min_unit }}</span>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </scroll-view>
        </view>
    </view>
</template>

<script>
// components/goods/index.js
const Config = require('../../config/index.js');

export default {
    data() {
        return {
            imgUrl: Config.imgUrl //图片url
        };
    },
    /**
     * 组件的属性列表
     */
    props: {
        navItem: {
            //导航信息
            type: Object,
            default: () => ({})
        }
    },
    /**
     * 组件的方法列表
     */
    methods: {
        goodsDetail(e, _dataset) {
            
            if (!e.currentTarget) {
                if (_dataSet.tagId) {
                    e.currentTarget = {
                        id: _dataSet.tagId
                    };
                } else {
                    e.currentTarget = {
                        dataset: _dataSet
                    };
                }
            }
            
            // 商品详情
            uni.navigateTo({
                url: '/pages/goodsDetail/index?id=' + e.currentTarget.dataset.id
            });
        },

        onGoType(e, _dataset) {
            
            if (!e.currentTarget) {
                if (_dataSet.tagId) {
                    e.currentTarget = {
                        id: _dataSet.tagId
                    };
                } else {
                    e.currentTarget = {
                        dataset: _dataSet
                    };
                }
            }
            
            let url = this.navItem.url;
            let type = this.navItem.id;
            let name = this.navItem.name;
            uni.navigateTo({
                url: url + '?type=' + type + '&name=' + name
            });
        }
    }
};
</script>
<style>
@import './index.css';
</style>
